<!DOCTYPE html>
<html>

<head>
       <title>avatar</title>
       <link rel="stylesheet" type="text/css" href="avatar.css">
       <link href="https://fonts.googleapis.com/css?family=Luckiest+Guy" rel="stylesheet">
     
</head>

<body>

       <section>
              <h1>ENTER YOUR NAME AND PRESS "CLICK Me" BUTTON TO GENERATE A AVATAR THAT DESCRIBE YOUR PERSONALITY.</h1>

              <div class="centerDiv">
                     <div class="details">
                            <label>ENTER YOUR NAME</label><br>
                            <input type="text" name="" id="nameid">
                     </div>

                     <div class="imgdiv">
                            <img src="https://fiverr-res.cloudinary.com/images/q_auto,f_auto/gigs/21760012/original/d4c0c142f91f012c9a8a9c9aeef3bac28036f15b/create-your-cartoon-style-flat-avatar-or-icon.jpg"
                                   width="200" height="200" class="imgchange">
                     </div>

                     <button class="clickme"> Click Me</button>
<br>

<button class="light">light mode</button> 
<button class="dark">dark mode</button>
              </div>
       </section>

<footer>made by shivam sisodia</footer>
       <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
       <script src="avatar.js"></script>

      
</body>

</html>



